<template>
  <div class="taskPanel">
    <el-collapse accordion>
      <ConventionalPage v-model:element="element" :bpmnModeler="props.bpmnModeler"></ConventionalPage>
      <UserTask v-model:element="element" :bpmnModeler="props.bpmnModeler"></UserTask>
      <ExecutionListener v-model:element="element" :bpmnModeler="props.bpmnModeler"></ExecutionListener>
      <TaskListener v-model:element="element" :bpmnModeler="props.bpmnModeler"></TaskListener>
    </el-collapse>
  </div>
</template>

<script setup>
import ConventionalPage from './properties/ConventionalPage.vue'
import ExecutionListener from './properties/ExecutionListener.vue'
import TaskListener from './properties/TaskListener.vue';
import UserTask from './properties/UserTask.vue';
// import { ref } from 'vue'
const element = defineModel("element", {
  default: {
    id: '',
    name: '',
    type: ''
  }
})
const props = defineProps({
  bpmnModeler: Object
})
// const activeName = ref('usertask')
</script>

<style lang="less" scoped></style>